.bg {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-top: 100px;

    .type {
        cursor: pointer;
        width: 700px;
        text-align: center;
    }

    .music-cover {
        position: relative;
        padding: 25px;

        &::after {
            content: '';
            width: 300px;
            height: 300px;
            position: absolute;
            left: 0;
            top: 0;
            background: var(--custom-img);
            background-size: contain;
            border-radius: 15px;
            box-shadow: 0 0 15px #333,
                0 10px 1px black,
                -10px 10px 1px black;
            transform: translateX(var(--custom-transform));
            transition: transform 2s ease 0s;

        }

        .container {
            width: 250px;
            height: 250px;
            background: linear-gradient(150deg,
                    rgba(20, 20, 20, 0.75),
                    rgba(20, 20, 20, 0.75) 40%),
                linear-gradient(150deg,
                    rgba(20, 20, 20, 0.75) 40%,
                    rgba(20, 20, 20, 0.75) 50%),
                repeating-radial-gradient(#1f1e1d, #1f1e1d 4px, white 5px, #1f1e1d 6px);
            border: 1px solid #333;
            box-shadow: 0 0 15px #333;
            border-radius: 50%;
            animation: move 5s linear infinite;
            position: relative;

            &:after {
                content: "";
                position: absolute;
                width: 150px;
                height: 150px;
                left: 50%;
                top: 50%;
                border-radius: 50%;
                margin-left: -75px;
                margin-top: -75px;
                background-image: var(--custom-img);
                background-size: contain;
                border: 15px solid #1f1e1d;
                box-sizing: border-box;
            }

            &:before {
                content: "";
                position: absolute;
                width: 15px;
                height: 15px;
                background: white;
                left: 50%;
                top: 50%;
                z-index: 99;
                margin-top: -7.5px;
                margin-left: -7.5px;
                border-radius: 50%;
                box-shadow: 0px 0px 3px #333 inset;
            }
        }

    }

    .desc {
        margin-top: 50px;
        text-align: center;
    }

    .opts {
        font-size: 20px;
        display: flex;
        justify-content: space-around;
    }
}

@keyframes move {
    to {
        transform: rotate(360deg);
    }
}